<template>
  <div id="app">
    <router-view></router-view>
    <tab-bar>
      <tab-bar-item path="/home"
        ><span slot="icon" class="iconfont icon-home"></span>
        <div slot="title">主页</div></tab-bar-item
      >
      <tab-bar-item path="/cart">
        <span slot="icon" class="iconfont icon-config"></span>
        <div slot="title">设置</div></tab-bar-item
      >
      <tab-bar-item path="/category">
        <span slot="icon" class="iconfont icon-maichepin"></span>
        <div slot="title">购物车</div></tab-bar-item
      >
      <tab-bar-item path="/profile">
        <span slot="icon" class="iconfont icon-myself"></span>
        <div slot="title">我的</div></tab-bar-item
      >
    </tab-bar>
  </div>
</template>

<script>
import tabBar from "./components/tabbar/TabBar.vue";
import TabBarItem from "./components/tabbar/TabBarItem.vue";

export default {
  components: { tabBar, TabBarItem },
  name: "App",
};
</script>

<style>
@import url("./assets/css/base.css");
@import url("./assets/iconfont/iconfont.css");
</style>
